<template>
	<view>
		<view>
			<view style="background: url(https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20230411/e63bcf73858e37c567847ca55821ddfa.png) no-repeat;background-size: 100%;width: 100%;height: 414rpx;">

			</view>
			<view style="width: 100%;position: absolute;top:10rpx;left: 0%;padding-bottom: 30rpx;">
				<view style="position: relative;width: 92%;margin: 0 auto;">
					<input type="text"   v-model="keywords" class="sou" placeholder-class="suo"
						placeholder="找人/找货/搜信息" confirm-type="search" @confirm="search" />
					<image
						src="https://dyeego.oss-cn-beijing.aliyuncs.com/uploads/20220325/91243acc628efa1338d3d38826d22484.png"
						class="souicon" mode=""></image>
				</view>

				<view class="fenlei" style="width: 92%;margin: 20rpx auto;">
					<swiper :indicator-dots="fl_xianshi" :class="['swiper',gaodu?'da_gao':'xiao_gao']">
						<swiper-item>
							<u-grid :border="false">
								<u-grid-item @click="tz_dianji(index,item.id,item.is_child,item.name)" :customStyle="{width:138+'rpx',height:138+'rpx'}"
									v-for="(item, index) in yuan_list1.slice(0,10)" :index="index" :key="index">
									<image :src="item.main_image" style="width: 80rpx;height: 80rpx;" mode=""></image>
									<view :class="index==tabindex?'actives':'as'"
										style="font-size: 24rpx;line-height: 30rpx;">
										{{item.name}}
									</view>
								</u-grid-item>
							</u-grid>
						</swiper-item>
						<swiper-item v-if="yuan_list1.length>10">
							<u-grid :border="false">
								<u-grid-item @click="tz_dianji(index+10,item.id,item.is_child,item.name)"
									:customStyle="{width:138+'rpx',height:138+'rpx'}"
									v-for="(item, index) in yuan_list1.slice(10,20)" :index="index + 10" :key="index">
									<image :src="item.main_image" style="width: 80rpx;height: 80rpx;" mode=""></image>
									<view :class="index+10==tabindex?'actives':'as'"
										style="font-size: 24rpx;line-height: 30rpx;">
										{{item.name}}
									</view>
								</u-grid-item>
							</u-grid>
						</swiper-item>
						<swiper-item v-if="yuan_list1.length>20">
							<u-grid :border="false">
								<u-grid-item @click="tz_dianji(index+20,item.id,item.is_child,item.name)"
									:customStyle="{width:138+'rpx',height:138+'rpx'}"
									v-for="(item, index) in yuan_list1.slice(20,30)" :index="index + 20" :key="index">
									<image :src="item.main_image" style="width: 80rpx;height: 80rpx;" mode=""></image>
									<view :class="index+20==tabindex?'actives':'as'"
										style="font-size: 24rpx;line-height: 30rpx;">
										{{item.name}}
									</view>
								</u-grid-item>
							</u-grid>
						</swiper-item>
					</swiper>

				</view>
				<view>
					<view style="width: 92%;margin:20rpx auto;">
						<view style="width:100%;margin: 26rpx auto 40rpx;display: flex;overflow: hidden;">
							<view style="width: 40%;float: left;padding-bottom: 20rpx;" @click="guanzhu(2)">
								<view style="position: relative;" :class="qi==2?'qiactive_type':'qi_type'">我的关注</view>
							</view>
							<view style="width: 40%;float: left;padding-bottom: 20rpx;" @click="guanzhu(1)">
								<view style="position: relative;" :class="qi==1?'qiactive_type':'qi_type'">期货报价</view>
							</view>

						</view>
						<view v-if="qi==1">
							<view style="width:100%;margin: 26rpx auto;display: flex;">
								<view @click="jiage(1)" :class="['yihang',tui_type==1?'tui_active':'tui_mei']"
									style="flex: 1;text-align: center;">
									全部企业<!-- <text class="iconfont icon-xiangxia" style="font-size: 22rpx;"></text> -->
								</view>
								<view v-if="yuan_list_arr.length>0" @click="jiage(2)" :class="['yihang',tui_type==2?'tui_active':'tui_mei']"
									style="flex: 1;text-align: center;">
									<text v-if="qihuo.length<=4">{{qihuo || jggy_name}}</text>
									<text v-if="qihuo.length>4">{{qihuo.slice(0,4)+'...' || jggy_name}}</text>
									<text class="iconfont icon-xiangxia" style="font-size: 22rpx;"></text>
								</view>
								<view  @click="jiage(3)" :class="['yihang',tui_type==3?'tui_active':'tui_mei']"
									style="flex: 1;text-align: center;">
									<!-- {{qihuo1 || '产区'}} -->
									<text v-if="qihuo1.length<=4">{{qihuo1 || '产区'}}</text>
									<text v-if="qihuo1.length>4">{{qihuo1.slice(0,4)+'...' || '产区'}}</text>
									<text class="iconfont icon-xiangxia" style="font-size: 22rpx;"></text>
								</view>
								<view  @click="jiage(4)" :class="['yihang',tui_type==4?'tui_active':'tui_mei']"
									style="flex: 1;text-align: center;">
									<!-- {{qihuo2 || '厂号'}} -->
									<text v-if="qihuo2.length<=4">{{qihuo2 || '厂号'}}</text>
									<text v-if="qihuo2.length>4">{{qihuo2.slice(0,4)+'...' || '厂号'}}</text>
									<text class="iconfont icon-xiangxia" style="font-size: 22rpx;"></text>
								</view>
							</view>
							<view style="width: 100%;box-sizing: border-box;padding: 30rpx;background-color: #FFFFFF;border-radius: 16rpx;margin-bottom: 20rpx;"
								v-for="(item,index) in qhjy_list" :key='index'>
								<view @click="changjia(item.brand_id)" style="overflow: hidden;">
									<view style="width: 18%;float: left;overflow: hidden;">
										<image :src="item.brand_avatar"
											style="width: 92rpx;height: 92rpx;border-radius: 50%;display: block;" mode="">
										</image>
									</view>
									<view style="width: 82%;float: left;padding: 6rpx 0;">
										<view style="height: 40rpx;line-height: 40rpx;">
											<text
												style="color: #000000;font-size: 30rpx;display: inline-block;font-weight: 600;float: left;">{{item.brand_name}}</text>
											<image :src="item.place.logo_image"
												style="width: 32rpx;height: 20rpx;float: left;margin-top: 10rpx;margin-left: 20rpx;"
												mode=""></image>
											<text
												style="color: #999999;font-size: 20rpx;float: left;margin-left: 20rpx;">({{item.place.name}})</text>
											<text
												style="color: #999999;font-size: 24rpx;float: right;">{{item.create_time_tips}}</text>
										</view>
										<view style="height: 40rpx;line-height: 40rpx;color: #010101;font-size: 24rpx;"
											class="yihang">
											{{item.brand_en_name}} <text
												style="float: right;color: #999999;font-size: 24rpx;">发布于{{item.create_time}}</text>
										</view>
									</view>
								</view>
								<view v-if="is_vip!=1">
									<view v-html="item.en_content"
										style="color: #010101;font-size: 26rpx;margin-top: 20rpx;line-height: 40rpx;">

									</view>
									<view style="background-color: #eeeeee;box-sizing: border-box;padding: 20rpx;border-radius: 10rpx;font-size: 26rpx;">
										<view v-html="item.cn_content">

										</view>
									</view>
								</view>
								<view v-if="is_vip==1">
									<view v-html="item.vip_en_content"
										style="color: #010101;font-size: 26rpx;margin-top: 20rpx;line-height: 40rpx;">

									</view>
									<view style="background-color: #eeeeee;box-sizing: border-box;padding: 20rpx;border-radius: 10rpx;font-size: 26rpx;">
										<view v-html="item.vip_cn_content">

										</view>
									</view>
								</view>
								<view style="display: flex;margin-top: 20rpx;">
									<view style="flex: 1;">
										<view @click="dcjs(item.brand_id)"
											style="width: 100%;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 24rpx;background-color: #C9E7E6;color: #1fb0ac;border-radius: 30rpx;">
											代采介绍

										</view>
									</view>
									<view @click="gz_cj(item.brand_id,index)" style="flex: 1;margin: 0 10rpx;">
										<view v-if="item.is_collect==1"
											style="width: 100%;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 24rpx;background-color: #1fb0ac;color: #ffffff;border-radius: 30rpx;">
											取消关注
										</view>
										<view v-if="item.is_collect==2"
											style="width: 100%;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 24rpx;background-color: #C9E7E6;color: #1fb0ac;border-radius: 30rpx;">
											关注厂家
										</view>
									</view>
									<view style="flex: 1;" @click="yijian(item.phone,item.brand_id)">
										<view style="width: 100%;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 24rpx;background-color: #1fb0ac;color: #ffffff;border-radius: 30rpx;">
											一键代采
										</view>
									</view>
								</view>
							</view>
							<view style="text-align: center;margin-top: 50rpx;">
								<image v-if="qh_kk"
									:src="require('@/static/my/no-data.png')"
									style="width: 334rpx;" mode="widthFix"></image>
								<view v-if="qhjy_list.length==0"
									style="text-align: center;color: #999999;font-size: 30rpx;line-height: 60rpx;">
									暂无推荐价格
								</view>
								<u-divider color='#717171' bg-color='#f0f2f8' height='80' border-color='#717171'
									text="没有更多了" v-if="qhjy_list.length>0 && qh_enmpy"></u-divider>
							</view>

						</view>
						<view v-if="qi==2">
							<!-- <view @click="tjgz" v-if="qhjy_list.length>0"
								style="width:230rpx;height: 60rpx;line-height: 60rpx;text-align: center;background-color: #1fb0ac;border-radius: 30rpx;font-size: 24rpx;color: #FFFFFF;margin: 20rpx auto 40rpx;">
								添加更多关注
							</view> -->
							<view @click="tjgz" style="text-align: center;margin-bottom: 30rpx;" v-if="qhjy_list.length>0">
								<image style="width: 314rpx;height: 84rpx;" src="https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20230413/74974a81381155a891392f6f6933908a.png" mode=""></image>
							</view>
							<view
								style="width: 100%;box-sizing: border-box;padding: 30rpx;background-color: #FFFFFF;border-radius: 16rpx;margin-bottom: 20rpx;"
								v-for="(item,index) in qhjy_list" :key='index'>
								<view @click="changjia(item.id)" style="overflow: hidden;">
									<view style="width: 18%;float: left;overflow: hidden;">
										<image :src="item.brand_avatar"
											style="width: 92rpx;height: 92rpx;border-radius: 50%;display: block;" mode="">
										</image>
									</view>
									<view style="width: 82%;float: left;padding: 6rpx 0;">
										<view style="height: 40rpx;line-height: 40rpx;">
											<text
												style="color: #000000;font-size: 30rpx;display: inline-block;font-weight: 600;float: left;">{{item.brand_name}}</text>
											<image :src="item.place.logo_image"
												style="width: 32rpx;height: 20rpx;float: left;margin-top: 10rpx;margin-left: 20rpx;"
												mode=""></image>
											<text
												style="color: #999999;font-size: 20rpx;float: left;margin-left: 20rpx;">({{item.place.name}})</text>
											<text
												style="color: #999999;font-size: 24rpx;float: right;">{{item.create_time_tips}}</text>
										</view>
										<view style="height: 40rpx;line-height: 40rpx;color: #010101;font-size: 24rpx;"
											class="yihang">
											{{item.brand_en_name}} <text
												style="float: right;color: #999999;font-size: 24rpx;">发布于{{item.create_time}}</text>
										</view>
									</view>
								</view>
								<view v-if="is_vip!=1">
									<view v-html="item.en_content"
										style="color: #010101;font-size: 26rpx;margin-top: 20rpx;line-height: 40rpx;">

									</view>
									<view style="background-color: #eeeeee;box-sizing: border-box;padding: 20rpx;">
										<view v-html="item.cn_content">

										</view>
									</view>
								</view>
								<view v-if="is_vip==1">
									<view v-html="item.vip_en_content"
										style="color: #010101;font-size: 26rpx;margin-top: 20rpx;line-height: 40rpx;">

									</view>
									<view style="background-color: #eeeeee;box-sizing: border-box;padding: 20rpx;">
										<view v-html="item.vip_cn_content">

										</view>
									</view>
								</view>
								<view style="display: flex;margin-top: 20rpx;">
									<view style="flex: 1;">
										<view @click="dcjs(item.brand_id)"
											style="width: 100%;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 24rpx;background-color: #C9E7E6;color: #1fb0ac;border-radius: 30rpx;">
											代采介绍

										</view>
									</view>
									<view @click="gz_cj(item.brand_id,index)" style="flex: 1;margin: 0 10rpx;">
										<view v-if="item.is_collect==1"
											style="width: 100%;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 24rpx;background-color: #1fb0ac;color: #ffffff;border-radius: 30rpx;">
											取消关注
										</view>
										<view v-if="item.is_collect==2"
											style="width: 100%;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 24rpx;background-color: #C9E7E6;color: #1fb0ac;border-radius: 30rpx;">
											关注厂家
										</view>
									</view>
									<view style="flex: 1;" @click="yijian(item.phone)">
										<view style="width: 100%;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 24rpx;background-color: #1fb0ac;color: #ffffff;border-radius: 30rpx;">
											一键代采
										</view>
										<!-- <button type="default" open-type="contact"
											style="width: 100%;height: 60rpx;line-height: 60rpx;text-align: center;font-size: 24rpx;background-color: #1fb0ac;color: #ffffff;border-radius: 30rpx;">
											一键代采

										</button> -->
									</view>
								</view>
							</view>
							<view style="text-align: center;margin-top: 50rpx;">
								<image v-if="qh_kk"
									:src="require('@/static/my/no-data.png')"
									style="width: 334rpx;" mode="widthFix"></image>
								<!-- <view v-if="qhjy_list.length==0" style="text-align: center;color: #999999;font-size: 30rpx;line-height: 60rpx;">
								暂无关注价格
							</view> -->
								<view @click="tjgz" v-if="qhjy_list.length==0"
									style="width:230rpx;height: 60rpx;line-height: 60rpx;text-align: center;background-color: #1fb0ac;border-radius: 30rpx;font-size: 24rpx;color: #FFFFFF;margin: 40rpx auto;">
									立即添加关注
								</view>
								<u-divider color='#717171' bg-color='#f0f2f8' height='80' border-color='#717171'
									text="没有更多了" v-if="qhjy_list.length>0 && qh_enmpy"></u-divider>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<lb-picker ref="picker" v-model="qihuo" mode="selector" :dataset="{ name: qihuo }" :list="list_arr"
			@confirm="handleConfirm" @change="qihuo_change">
		</lb-picker>
		<lb-picker ref="picker1" v-model="qihuo1" mode="selector" :dataset="{ name: qihuo1 }" :list="list_arr1"
			@confirm="handleConfirm1" @change="qihuo_change1">
		</lb-picker>
		<lb-picker ref="picker2" v-model="qihuo2" mode="selector" :dataset="{ name: qihuo2 }" :list="list_arr2"
			@confirm="handleConfirm2" @change="qihuo_change2">
		</lb-picker>
		<uni-popup id="popup" ref="popup3" :type="type_status" :animation="true">
			<view class="" style="background-color: #FFFFFF;padding:30upx;border-radius: 20upx;width: 500rpx;">
				<view @click="yijian_phone" style="width: 100%;height: 80rpx;line-height: 80rpx;text-align: center;font-size: 24rpx;background-color: #C9E7E6;color: #1fb0ac;border-radius: 40rpx;margin-bottom: 20rpx;">
					拨打电话
				</view>
				<button @click="yijian_kefu" type="default" open-type="contact"
					style="width: 100%;height: 80rpx;line-height: 80rpx;text-align: center;font-size: 24rpx;background-color: #1fb0ac;color: #ffffff;border-radius: 40rpx;">
					联系客服
				</button>

			</view>
		</uni-popup>

		<uni-popup id="popup" ref="popup4" :type="type_status" :animation="true">
			<view class="" style="background-color: #FFFFFF;padding:30upx;border-radius: 20upx;width: 600rpx;">
				<view  style="width: 100%;z-index: 5;border-radius:30rpx ;margin: 0 auto 20rpx;position: relative;">

					<input @input="sousuo_changhao" type="text"  class="sou1" placeholder-class="suo1"
						placeholder="请输入厂号"  />
					<image
						src="https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20230801/8f40a867b99ae8c72cc57a9698b6ce81.png"
						class="souicon" mode=""></image>
				</view>
				<scroll-view scroll-y="true" style="height: 600rpx;">

					<view style="width: 100%;overflow: hidden;" class="changhao_box">
						<view class="yihang" @click="qihuo_change2(index)" v-for="(item,index) in yuan_list_arr2" :class="item.id==specification_ids?'ch_active':'ch_as'" style="width: 32%;float: left;height: 60rpx;line-height: 60rpx;text-align: center;border-radius: 30rpx;box-sizing: border-box;padding: 0 10rpx;">
							{{item.name || ''}}
						</view>

					</view>
				</scroll-view>
				<view style="display: flex;line-height: 80rpx;padding-top: 20rpx;background-color: #fff;">
					<!-- <view @click="changhao_qx" style="flex: 1;height: 80rpx;font-size: 30rpx;color: #333333;text-align: center;border-radius:20rpx;background-color: #F1F1F1;">
						取消
					</view> -->
					<view @click="changhao_wc" style="flex: 1;height: 80rpx;font-size: 30rpx;color: #FFFFFF;text-align: center;border-radius:20rpx;background-color: #5EC4C2;">
						确定
					</view>
				</view>
			</view>
		</uni-popup>
		<noLoginToast ref="noLoginToast"/>
    <callPhone ref="callPhone" />
	</view>
</template>

<script>
	import vgtTab from '@/components/vgt-tab.vue'
	import LbPicker from '@/components/lb-picker'
	export default {
		components: {
			vgtTab,
			LbPicker
		},
		data() {
			return {
				id:'',
				name:'',
				yuan_list1:[],
				order_type:'',
				fl_xianshi:false,
				gaodu:false,
				list5:[],
				qi:1,
				tui_type: 1,
				qh_kk:false,
				qhjy_list:[],
				qh_enmpy:false,
				qhjy_page:1,
				tabindex:0,


				qihuo: '',
				list_arr: [],
				yuan_list_arr: [],
				qihuo1: '',
				list_arr1: [],
				yuan_list_arr1: [],
				qihuo2: '',
				list_arr2: [],
				yuan_list_arr2: [],


				craft_ids:'',
				place_ids:'',
				manage_category_ids:'',

				daicai_phone:'',
				brand_id:'',
				type_status:'center',
				specification_ids:'',
				jggy_name:'',
				is_vip:2
			}
		},
		onLoad(option) {

			this.id = option.id
			this.jggy()
			this.userinfo()
			this.chanqu()
			this.baozhuang()
			this.tzxuanze_fl()
			this.qijylist()
			this.name = option.name
			uni.setNavigationBarTitle({
				title: option.name
			})

		},
		onReachBottom: function() {
			console.log(222222222)
			if (this.qh_enmpy) {
				return
			} else {
				this.qijylist()
			}
		},
		methods: {
			changjia:function(id){
				uni.navigateTo({
					url:'/fenbao/pages/wenzhang/cjxq?id='+id
				})
			},
			userinfo: function() {
				this.post('api/client/info', '', true).then(res => {
					console.log(res)
					if (res.code == 1) {
						this.is_vip = res.data.is_vip
					}
				})
			},
			// 添加关注
			async tjgz() {
				let isLogin = await this.$refs.noLoginToast.open()
				if (isLogin) {
					let isHasMobile = await this.$refs.noLoginToast.getPhoneNumber()
					console.log('%c [ isHasMobile ]-452', 'font-size:13px; background:pink; color:#bf2c9f;', isHasMobile)
					if (isHasMobile) {
						uni.navigateTo({
							url: '../../../subpages/pages/guanzhu'
						})
					}
				}
			},
			yijian:function(phone,brand_id){
				this.$refs.popup3.open()
				this.daicai_phone=phone
				this.brand_id=brand_id
			},
			callPhone(phoneNumber) {
				console.log(phoneNumber)
				this.$refs.callPhone.open(phoneNumber)
			},
			yijian_phone:function(){
				this.$refs.popup3.close()
				this.callPhone(this.daicai_phone)
				// uni.makePhoneCall({
				// 	phoneNumber: this.daicai_phone //仅为示例
				// });
			},
			yijian_kefu:function(){
				let that=this
				this.$refs.popup3.close()
				this.post('api/im/im/purchasing',{brand_id:this.brand_id},true).then(res=>{
					if(res.code==1){
						let aid='GROUP'+res.data.group_id
						if(uni.getStorageSync('userinfo').is_server==1){
							uni.setStorageSync('user_id',res.data.user.id)
						}else{
							uni.setStorageSync('user_id',0)
						}

						uni.setStorageSync('friend_name',res.data.server.name)
						uni.navigateTo({
						  	url: `/im/chat/dan_chat?conversationID=${aid}`,
						  	 // url: `/im/login/login`,
						})
					}else{
									uni.showToast({
										title: res.msg,
										icon: "none",
										duration: 1000
									})
								}
				})
			},
			// 代采介绍
			async dcjs(id) {
				let isLogin = await this.$refs.noLoginToast.open()
				if (isLogin) {
					let isHasMobile = await this.$refs.noLoginToast.getPhoneNumber()
					console.log('%c [ isHasMobile ]-452', 'font-size:13px; background:pink; color:#bf2c9f;', isHasMobile)
					if (isHasMobile) {
						uni.navigateTo({
							url: '../../../subpages/pages/dcjs?id=' + id
						})
					}
				}

			},
			// 关注厂家
			async gz_cj(id, index) {
				let isLogin = await this.$refs.noLoginToast.open()
				if (isLogin) {
					let isHasMobile = await this.$refs.noLoginToast.getPhoneNumber()
					console.log('%c [ isHasMobile ]-452', 'font-size:13px; background:pink; color:#bf2c9f;', isHasMobile)
					if (isHasMobile) {
						this.post('api/futures/attention', {
							id: id
						}, true).then(res => {
							console.log(res)
							if (res.code == 1) {
								uni.showToast({
									title: res.msg,
									icon: "none",
									duration: 1000
								})
								if (res.data) {
									for(let i=0;i<this.qhjy_list.length;i++){
										if(id==this.qhjy_list[i].brand_id){
											this.qhjy_list[i].is_collect = 1
										}
									}

								} else {
									for(let i=0;i<this.qhjy_list.length;i++){
										if(id==this.qhjy_list[i].brand_id){
											this.qhjy_list[i].is_collect = 2
										}
									}
									if(this.qi==2){
										this.qh_kk=false
										this.qhjy_list=[]
										this.qh_enmpy=false
										this.qhjy_page=1
										this.qijylist()
									}
								}
								// if (this.qi == 2) {
								// 	this.qhjy_list.splice(index, 1)
								// 	if (this.qhjy_list.length <= 0) {
								// 		this.qh_kk = true
								// 	}
								// }
							}
						})
					}
				}
			},
			jiage: function(index) {
				this.tui_type = index
				if (index == 2) {
					this.$refs['picker'].show()
				} else if (index == 3) {
					this.$refs['picker1'].show()
				} else if (index == 4) {
					// this.$refs['picker2'].show()
					this.$refs.popup4.open()
				} else if (index == 1) {
					this.qihuo = ''
					this.qihuo1 = ''
					this.qihuo2 = ''
					this.qhjy_list = []
					this.qhjy_page = 1
					this.qh_enmpy = false
					this.qh_kk = false
					this.craft_ids = ''
					this.place_ids = ''
					// this.manage_category_ids = ''
					this.qijylist()
				}
			},
			//期货交易切换
			guanzhu: function(index) {
				this.qi = index
				this.qhjy_page = 1
				this.qhjy_list = []
				this.qihuo = ''
				this.list_arr = []
				this.yuan_list_arr = []
				this.qihuo1 = ''
				this.list_arr1 = []
				this.yuan_list_arr1 = []
				this.qihuo2 = ''
				this.list_arr2 = []
				this.yuan_list_arr2 = []
				this.qh_enmpy = false
				this.qh_kk = false
				this.tui_type = 1
				this.craft_ids = ''
				this.place_ids = ''
				this.manage_category_ids = ''
				this.specification_ids=''
				// this.qhjy_list = []
				// this.qhjy_page = 1
				this.jggy()
				this.chanqu()
				this.baozhuang()
				this.qijylist()
			},
			// 品牌规格
			jggy: function() {
				this.list_arr=[]
				this.yuan_list_arr=[]
				this.post('api/futures/craft', {manage_id:this.manage_category_ids || this.id}, true).then(res => {
					console.log(res)
					if (res.code == 1) {
						this.yuan_list_arr = res.data.list
						this.jggy_name=res.data.craft_name
						for (let i = 0; i < res.data.list.length; i++) {
							this.list_arr.push(res.data.list[i].name)
						}
					}
				})
			},
			// 产区
			chanqu: function() {
				this.list_arr1=[]
				this.yuan_list_arr1=[]
				this.post('api/futures/place', {manage_category_ids: ''}, true).then(res => {
					console.log(res)
					if (res.code == 1) {
						this.yuan_list_arr1 = res.data
						for (let i = 0; i < res.data.length; i++) {
							this.list_arr1.push(res.data[i].name)
						}
					}
				})
			},
			//包装
			baozhuang: function(keywords) {
				this.list_arr2=[]
				this.yuan_list_arr2=[]
				this.post('api/futures/specification', {manage_category_ids: this.manage_category_ids,keywords:keywords}, true).then(res => {
					console.log(res)
					if (res.code == 1) {
						this.yuan_list_arr2 = res.data
						for (let i = 0; i < res.data.length; i++) {
							this.list_arr2.push(res.data[i].name)
						}
					}
				})
			},



			handleConfirm(e) {

				this.qhjy_page = 1
				this.qhjy_list = []
				this.qijylist()
			},
			qihuo_change:function(e){
				let that = this
				let index = e.index[0] || e.index
				console.log(index, 123456)
				this.craft_ids = this.yuan_list_arr[index].id
			},
			handleConfirm1(e) {
				// let that = this
				// let index = e.index[0] || e.index
				// console.log(index, 123456)
				// this.place_ids = this.yuan_list_arr1[index].id
				this.qhjy_page = 1
				this.qhjy_list = []
				this.qijylist()
			},
			qihuo_change1:function(e){
				let that = this
				let index = e.index[0] || e.index
				console.log(index, 123456)
				this.place_ids = this.yuan_list_arr1[index].id
			},
			handleConfirm2(e) {

				this.qhjy_page = 1
				this.qhjy_list = []
				this.qijylist()
			},
			qihuo_change2:function(index){
				// let that = this
				// let index = e.index[0] || e.index
				console.log(index, 123456)
				this.specification_ids = this.yuan_list_arr2[index].id
				this.qihuo2=this.yuan_list_arr2[index].name
				this.qhjy_page = 1
				this.qhjy_list = []
				console.log('hhhhhhhhh')
				this.qijylist()
			},
			changhao_qx:function(){
				this.$refs.popup4.close()
			},
			changhao_wc:function(){
				this.$refs.popup4.close()
				this.qhjy_page = 1
				this.qhjy_list = []
				console.log('hhhhhhhhh')
				this.qijylist()
			},
			sousuo_changhao:function(e){
				this.baozhuang(e.detail.value)
			},
			tz_dianji(index,id) {
				this.tabindex=index
				if(index==0){
					this.manage_category_ids=''
				}else{
					this.manage_category_ids=id
				}
				this.jggy()
				this.qhjy_list = []
				this.qhjy_page = 1
				this.qh_enmpy = false
				this.qh_kk = false
				this.qijylist()
			},
			tzxuanze_fl: function() {
				this.post('api/futures/manage', {manage_id:this.manage_category_ids || this.id}, true).then(res => {
					console.log(res)
					if (res.code == 1) {
						// let arr = [{
						// 	name: '全部',
						// 	id: ''
						// }]
						let arr = [{
							name: '全部',
							id: this.pid,
							main_image: 'https://static-1310167831.cos.ap-nanjing.myqcloud.com/uploads/20230413/8bfd4d306109650a72cdcc7741788c1b.png'
						}]
						this.yuan_list1 = arr.concat(res.data)
						if (this.yuan_list1.length > 10) {
							this.fl_xianshi = true
						}
						if(this.yuan_list1.length >5){
							this.gaodu=true
						}
						console.log(this.yuan_list1,222222222222)
						// for (let i = 0; i < this.yuan_list1.length; i++) {
						// 	this.list1.push(this.yuan_list1[i].name)
						// }
						for (let i = 0; i < this.yuan_list1.length; i++) {
							this.list5.push({name:this.yuan_list1[i].name,check:false})
						}
						console.log(this.list5,1111111)
						this.list5[0].check=true

					}
				})
			},
			// 期货交易列表
			qijylist: function() {
				if (this.qi == 1) {
					this.brand_id = false
				} else {
					this.brand_id = true
				}
				let data = {
					page: this.qhjy_page,
					limit: 10,
					craft_ids: this.craft_ids,
					place_ids: this.place_ids,
					manage_category_ids: this.manage_category_ids || this.id,
					brand_id: this.brand_id,
					specification_ids:this.specification_ids
				}
				this.post('api/futures', data, true).then(res => {
					console.log(res)
					if (res.code == 1) {
						if (this.qhjy_page == 1) {
							if (res.data.data == null || res.data.data.length == 0) {
								this.qh_kk = true
								this.qh_enmpy = true
								return
							} else if (res.data.data.length < 10) {
								this.qh_enmpy = true
							}
						} else {
							if (res.data.data == null || res.data.data.length == 0) {
								this.qh_enmpy = true
								return
							} else if (res.data.data.length < 10) {
								this.qh_enmpy = true
							}
						}

						this.qhjy_page++
						this.qhjy_list.push(...res.data.data)
						console.log(this.qhjy_list, 123456789)
					} else {
						this.qh_kk = true
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 1000
						})
					}
				})
			},


		}
	}
</script>

<style lang="scss">
	// 期货交易
	.qi_type {
		color: #999999;
		font-size: 30rpx;
		font-weight: 500;
	}

	.qiactive_type {
		color: #000000;
		font-size: 30rpx;
		font-weight: 600;
	}

	.qiactive_type::after {
		content: ''; // 必须
		position: absolute;
		left: 10%;
		bottom: -20rpx;
		// transform: translateX(-50%);
		width: 60rpx;
		height: 6rpx;
		background-color: #1fb0ac;
	}
	.tui_mei {
		color: #666666;
		font-size: 28rpx;
		font-weight: 500;
	}

	.tui_active {
		color: #000000;
		font-size: 28rpx;
		font-weight: 600;
	}











	.active_fl{
		color: #1fb0ac;
		font-size: 28rpx;
	}

	.a_fl {
		color: #666666;
		font-size: 28rpx;
	}

	.active_fl::after {
		content: ''; // 必须
		position: absolute;
		left: 50%;
		bottom: 6rpx;
		transform: translateX(-50%);
		width: 80rpx;
		height: 6rpx;
		background-color: #1fb0ac;
	}

	.renmen>view{
		margin-right: 30rpx;
	}
	.u-safe-area-inset-bottom{
		padding-bottom: 0!important;
	}
	.sx_as{
		color: #000000;
		background-color: #F8F8F8;
	}
	.sx_active{
		color: #ffffff;
		background-color: #5EC4C2;
	}
	.more_sx>view{
		margin: 10rpx 28rpx 10rpx 0;
	}
	.more_sx>view:nth-child(2n){
		margin-right: 0;
	}
	.grid-text {
		font-size: 14px;
		color: #909399;
		padding: 10rpx 0 20rpx 0rpx;
		/* #ifndef APP-PLUS */
		box-sizing: border-box;
		/* #endif */
	}

	.xiao {
		color: #19BE6B;
		font-size: 20rpx;
		padding: 0rpx 10rpx;
		background: #f3f3f3;
		border-radius: 14rpx;
		display: inline-block;
		height: 30rpx;
		line-height: 30rpx;
		margin-right: 10rpx;
		margin-bottom: 10rpx;
		float: left;
	}

	.actives {
		color: #1fb0ac;
	}

	.as {
		color: #000000;
	}

	.sticky-box {
		/* #ifndef APP-PLUS-NVUE */
		// display: flex;
		position: -webkit-sticky;
		/* #endif */
		position: sticky;
		top: var(--window-top);
		z-index: 100;
		flex-direction: row;
		margin: 0px;
		// position: fixed;
		// top: 0;
		// left: 0;
		// z-index: 100;
	}

	page {
		background-color: #F8F8F8 !important;
		font-family: Demibold;
	}

	.sou {
		width: 100%;
		height: 80rpx;
		line-height: 80rpx;
		border-radius: 40rpx;
		color: #FFFFFF;
		font-size: 26rpx;
		box-sizing: border-box;
		padding: 0 30rpx 0 80rpx;
		background-color: rgba(255, 255, 255, .3);
	}

	.suo {
		color: #FFFFFF;
		opacity: 1;
		font-size: 26rpx;
	}

	.souicon {
		width: 30rpx;
		height: 30rpx;
		position: absolute;
		top: 50%;
		left: 30rpx;
		transform: translateY(-50%);

	}

	.sou1 {
		width: 100%;
		height: 60rpx;
		line-height: 60rpx;
		border-radius: 30rpx;
		color: #333;
		font-size: 26rpx;
		box-sizing: border-box;
		padding: 0 30rpx 0 80rpx;
		background-color: #eee;
	}
	.suo1 {
		color: #666;
		opacity: 1;
		font-size: 26rpx;
	}
	.changhao_box>view:nth-child(3n+2){
		margin: 0 2%;
	}
	.changhao_box>view{
		margin-bottom: 20rpx;
	}
	.ch_active{
		background-color: #1fb0ac;
		color: #fff;
		font-size: 28rpx;
	}
	.ch_as{
		background-color: #eee;
		color: #333;
		font-size: 28rpx;
	}


	.fenlei {
		width: 100%;
		margin: 26rpx 0;
		background-color: #FFFFFF;
		box-sizing: border-box;
		padding: 20rpx 0 10rpx;
		overflow: hidden;
		border-radius: 10rpx;
	}
	.da_gao{
		height: 320rpx;
	}
	.xiao_gao{
		height: 160rpx;
	}

	.tu>view {
		margin: 10rpx 0;
	}

	.tu>view:nth-child(3n+2) {
		margin: 10rpx 30rpx;
	}


	.scroll-h {
	    width: 100%;
		margin: 0 auto;
	    height: 80rpx;
		line-height: 80rpx;
		box-sizing: border-box;
		padding-right: 40rpx;
	    flex-direction: row;
	    /* #ifndef APP-PLUS */
	    white-space: nowrap;
	    /* #endif */
	    /* flex-wrap: nowrap; */
	    /* border-color: #cccccc;
		border-bottom-style: solid;
		border-bottom-width: 1px; */
	}

	.uni-tab-item {
	    /* #ifndef APP-PLUS */
	    display: inline-block;
	    /* #endif */
	    flex-wrap: nowrap;
		/* float: left; */
	    padding-left: 30rpx;
	    padding-right: 30rpx;
		position: relative;
		 display: inline-block;
	}
	.uni-tab-item:after{

	}
	.uni-tab-item:first-child:after{
		background: none;
	}
	.uni-tab-item-title {
	    height: 80rpx;
	    line-height: 80rpx;
	    flex-wrap: nowrap;
		font-size: 30rpx;
		color: #999999;
	    /* #ifndef APP-PLUS */
	    white-space: nowrap;
	    /* #endif */
	}

	.uni-tab-item-title-active {
	    font-weight: 600;
	    font-size: 30rpx;
		color: #000000;
	}
</style>
